.main {
    width: 100%;
    min-height: 100vh;
    display: flex;
    background-color: var(--bg-color);
    color: var(--text-color);
    display: flex;
    overflow-y: scroll;
    -ms-overflow-style: none;
    /* IE/Edge */
    scrollbar-width: none;

    /* Firefox */
    &>::-webkit-scrollbar {
        display: none;
        /* Chrome/Safari */
    }

    .nav_wrapper {
        min-height: 100%;
        width: 200px;
        background: var(--nav-wrapper);

        .my-menu {
            border-right: none;

            .el-menu-item,
            .el-sub-menu {
                background: var(--nav-wrapper);
                color: var(--nav-text);

                &:hover {
                    color: var(--nav-active);
                }
            }

            .el-sub-menu__title,
            .el-menu-item {
                color: var(--nav-text);

                &:hover,
                &.is-active {
                    color: var(--nav-active);
                    background: var(--nav-hover-bg);
                }

            }
        }
    }

    .content_wrapper {
        height: 100%;
        flex: 1;
        padding: 10px;
    }


    .main_box {
        padding: 20px;

        h1 {
            font-size: 16px;
            margin-bottom: 20px;
        }

        .main_row {
            background: var(--bg-color-secondary);
            color: var(--text-color);
            padding: 10px;
            border-radius: 5px;
            margin-bottom: 20px;
        }

        .main_text {
            font-size: 16px;
            line-height: 1.7;
        }
    }
}

.el-page-header__content {
    color: var(--text-color) !important;
}

.text {
    color: #42b883;
}

.bg-dark {
    background: #1a1a1a !important;
}

.bg-dark-info {
    background: #242424 !important;
}

.bg-light {
    background: #f5f5f5 !important;
}

.bg-light-info {
    background: #e1e3e5 !important;
}


* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;

    /* 全局滚动条美化 */
    ::-webkit-scrollbar {
        width: 8px;
        background: #f1f1f1;
    }

    ::-webkit-scrollbar-thumb {
        background: #827354;
        border-radius: 4px;
    }
}